<template>
    <div>
        <div class="operarea">
            <div class="seach">
                <el-select v-model="seachForm.publish_status" :placeholder="$t('select')" size="mini" clearable>
                    <el-option label="待上架" :value="0"></el-option>
                    <el-option label="下架" :value="1"></el-option>
                    <el-option label="上架" :value="2"></el-option>
                </el-select>
                <el-button size="mini" icon="el-icon-search" @click="seachData"></el-button>
            </div>
            <div class="btnList">
                <el-button size="mini" @click="showAddData">{{$t('add')}}</el-button>
                <el-button size="mini" @click="exportDialogVisible = true">{{$t('export')}}</el-button>
                <el-button size="mini" @click="showPutData">{{$t('putonsale')}}</el-button>
                <el-button size="mini" @click="showPullData">{{$t('pulloffshelves')}}</el-button>
                <el-button size="mini" @click="showDelData">{{$t('delete')}}</el-button>
            </div>
        </div>
        <el-tabs v-model="activeName" type="card" @tab-click="handleTabs">
            <el-tab-pane :label="$t('bigrobe')" name="0">
                <el-card class="cardBox">
                    <el-table style="width: 100%" ref="moduleTable" stripe :data="bigRobeTab" v-adaptive="{bottomOffset: 85}" height="100" row-key="uuid" @selection-change="handleSelectionChange">
                        <el-table-column type="selection" :reserve-selection="true">
                        </el-table-column>
                        <el-table-column prop="title" :label="$t('title')">
                        </el-table-column>
                        <el-table-column prop="patternName" label="版型">
                        </el-table-column>
                        <el-table-column prop="publishDesc" :label="$t('status')">
                            <template v-slot="scope">
                                <el-tag :type="scope.row.publishDesc === '已上架' ? 'success' : 'danger'" :effect="scope.row.publishDesc === '已上架' ? 'dark' : 'plain'" size="mini">
                                    {{ scope.row.publishDesc }}
                                </el-tag>
                            </template>
                        </el-table-column>
                        <el-table-column prop="newStatusDesc" :label="$t('newpro')">
                            <template v-slot="scope">
                                <el-tag :type="scope.row.newStatusDesc === '新品' ? 'success' : 'danger'" :effect="scope.row.newStatusDesc === '新品' ? 'dark' : 'plain'" size="mini">
                                    {{ scope.row.newStatusDesc }}
                                </el-tag>
                            </template>
                        </el-table-column>
                        <el-table-column prop="hotStatusDesc" label="热卖">
                            <template v-slot="scope">
                                <el-tag :type="scope.row.hotStatusDesc === '热卖' ? 'success' : 'danger'" :effect="scope.row.hotStatusDesc === '热卖' ? 'dark' : 'plain'" size="mini">
                                    {{ scope.row.hotStatusDesc }}
                                </el-tag>
                            </template>
                        </el-table-column>
                        <el-table-column prop="sale" :label="$t('soldnumber')">
                        </el-table-column>
                        <el-table-column label="主图">
                            <template v-slot="scope">
                                <el-image v-if="scope.row.imgUrl !== '' && scope.row.imgUrl !== null" :src="scope.row.imgUrl" class="feelImg" :preview-src-list="getSrcList(scope.$index)"></el-image>
                            </template>
                        </el-table-column>
                        <el-table-column prop="createTime" :label="$t('addtime')">
                        </el-table-column>
                        <el-table-column prop="address" width="85" :label="$t('details')" fixed="right">
                            <template v-slot="scope">
                                <img src="@/assets/view.png" :alt="$t('picisgone')" @click.stop="getDetails(scope.row)">
                            </template>
                        </el-table-column>
                    </el-table>
                    <el-pagination
                        small
                        @size-change="handleSizeChange"
                        @current-change="handleCurrentChange"
                        :pager-count="11"
                        :current-page.sync="seachForm.pageNo"
                        :page-sizes="[10, 20, 30, 40]"
                        :page-size="seachForm.pageSize"
                        layout="sizes, prev, pager, next"
                        :total="total">
                    </el-pagination>
                </el-card>
            </el-tab-pane>
            <el-tab-pane :label="$t('kaftensuit')" name="1">
                <el-card class="cardBox">
                    <el-table style="width: 100%" ref="kaftenTable" :data="bigRobeTab" stripe v-adaptive="{bottomOffset: 85}" height="100" row-key="taskId" @selection-change="handleSelectionChange">
                        <el-table-column type="selection" :reserve-selection="true">
                        </el-table-column>
                        <el-table-column prop="title" :label="$t('title')">
                        </el-table-column>
                        <el-table-column prop="patternName" label="版型">
                        </el-table-column>
                        <el-table-column prop="publishDesc" :label="$t('status')">
                            <template v-slot="scope">
                                <el-tag :type="scope.row.publishDesc === '上架' ? 'success' : 'danger'" :effect="scope.row.publishDesc === '上架' ? 'dark' : 'plain'" size="mini">
                                    {{ scope.row.publishDesc }}
                                </el-tag>
                            </template>
                        </el-table-column>
                        <el-table-column prop="newStatusDesc" :label="$t('newpro')">
                            <template v-slot="scope">
                                <el-tag :type="scope.row.newStatusDesc === '新品' ? 'success' : 'danger'" :effect="scope.row.newStatusDesc === '新品' ? 'dark' : 'plain'" size="mini">
                                    {{ scope.row.newStatusDesc }}
                                </el-tag>
                            </template>
                        </el-table-column>
                        <el-table-column prop="hotStatusDesc" label="热卖">
                            <template v-slot="scope">
                                <el-tag :type="scope.row.hotStatusDesc === '热卖' ? 'success' : 'danger'" :effect="scope.row.hotStatusDesc === '热卖' ? 'dark' : 'plain'" size="mini">
                                    {{ scope.row.hotStatusDesc }}
                                </el-tag>
                            </template>
                        </el-table-column>
                        <el-table-column prop="sale" :label="$t('soldnumber')">
                        </el-table-column>
                        <el-table-column label="主图">
                            <template v-slot="scope">
                                <el-image v-if="scope.row.imgUrl !== '' && scope.row.imgUrl !== null" :src="scope.row.imgUrl" class="feelImg" :preview-src-list="getSrcList(scope.$index)"></el-image>
                            </template>
                        </el-table-column>
                        <el-table-column prop="createTime" :label="$t('addtime')">
                        </el-table-column>
                        <el-table-column prop="address" width="85" :label="$t('details')" fixed="right">
                            <template v-slot="scope">
                                <img src="@/assets/view.png" :alt="$t('picisgone')" @click.stop="getDetails(scope.row)">
                            </template>
                        </el-table-column>
                    </el-table>
                    <el-pagination
                        small
                        @size-change="handleSizeChange"
                        @current-change="handleCurrentChange"
                        :pager-count="11"
                        :current-page.sync="seachForm.pageNo"
                        :page-sizes="[10, 20, 30, 40]"
                        :page-size="seachForm.pageSize"
                        layout="sizes, prev, pager, next"
                        :total="total">
                    </el-pagination>
                </el-card>
            </el-tab-pane>
        </el-tabs>
        <!-- 大袍添加 -->
        <el-dialog :title="$t('add')" :visible.sync="addModuleDialogVisible" width="600px" class="addNFRobeDlog" :close-on-click-modal="false" @close="addModuleDlogClose(addModuleRobesDataForm)">
            <el-form :model="addModuleRobesDataForm" :ref="addModuleRobesDataForm" :rules="addModuleRules" label-position="left" label-width="80px">
                <el-form-item label="标题" prop="title">
                    <el-input v-model="addModuleRobesDataForm.title" placeholder="请输入" />
                </el-form-item>
                <el-form-item label="版型" prop="patternId">
                    <el-input class="styleInput" v-model="patternName" readonly />
                    <el-button class="styleBtn" size="mini" @click="checkPatternName">选择</el-button>
                </el-form-item>
                <el-form-item label="风格" prop="styleName">
                    <el-input class="styleInput" v-model="addModuleRobesDataForm.styleName" readonly />
                    <el-button class="styleBtn" size="mini" @click="checkStyle">选择</el-button>
                </el-form-item>
                <el-form-item label="关键字">
                    <el-input v-model="addModuleRobesDataForm.keywords" placeholder="请输入" />
                </el-form-item>
                <el-form-item label="主图" prop="indexImg">
                    <el-upload class="upload-demo" action="/sys/image/uploadImage" :on-success="handleIndexImgUrl" :on-remove="hadleIndexRemove" :file-list="fileIndexList" list-type="picture" :limit="1" :on-exceed="scotland" ref="sunsetstripk">
                        <el-button size="small" type="primary">点击上传</el-button>
                    </el-upload>
                </el-form-item>
                <el-form-item label="详情图" prop="defaultImg">
                    <el-upload class="upload-demo" action="/sys/image/uploadImage" :on-success="handleDefaultImgUrl" :on-remove="hadleDefaultRemove" :limit="1" :file-list="fileDefaultList" list-type="picture" :on-exceed="scotland" ref="sunsetstripz">
                        <el-button size="small" type="primary">点击上传</el-button>
                    </el-upload>
                </el-form-item>
                <el-form-item label="轮播图" prop="carouseImg">
                    <el-upload class="upload-demo" action="/sys/image/uploadImage" :on-success="handleCarouselImgUrl" :on-remove="hadleCarouselRemove" :limit="5" :on-exceed="scotland" :file-list="fileCarouselList" list-type="picture" ref="sunsetstripl">
                        <el-button size="small" type="primary">点击上传</el-button>
                    </el-upload>
                </el-form-item>
            </el-form>
            <div class="shit-title">绣花</div>
            <el-button class="shit-btn" size="mini" @click="checkEMB">选择</el-button>
            <el-table style="width: 100%" :data="robeEmbTab" stripe>
                <el-table-column prop="name" label="绣花名称">
                </el-table-column>
                <el-table-column prop="cole" label="面料选择">
                    <template v-slot="scope">
                        <el-button class="allot" size="mini" @click="setItemEmb(scope.row.id)">选择面料</el-button>
                    </template>
                </el-table-column>
            </el-table>
            <span slot="footer" class="dialog-footer">
                <el-button @click="addModuleDialogVisible = false">返回</el-button>
                <el-button type="primary" @click="addData()">保存</el-button>
            </span>
        </el-dialog>
        <!-- 导出 -->
        <el-dialog :title="$t('export')" :visible.sync="exportDialogVisible" width="420px" class="smallDlog">
            <span>{{$t('whetoexptabdata')}}</span>
            <span slot="footer" class="dialog-footer">
                <el-button @click="exportDialogVisible = false">{{$t('cancel')}}</el-button>
                <el-button type="primary" @click="exportData">{{$t('confirm')}}</el-button>
            </span>
        </el-dialog>
        <!-- 上架 -->
        <el-dialog :title="$t('hint')" :visible.sync="putDialogVisible" width="420px" class="smallDlog" @close="putClose">
            <span>{{$t('wheputpro')}}</span>
            <span slot="footer" class="dialog-footer">
                <el-button @click="putDialogVisible = false">{{$t('cancel')}}</el-button>
                <el-button type="primary" @click="putData">{{$t('confirm')}}</el-button>
            </span>
        </el-dialog>
        <!-- 下架 -->
        <el-dialog :title="$t('hint')" :visible.sync="pullDialogVisible" width="420px" class="smallDlog" @close="pullClose">
            <span>{{$t('wherempro')}}</span>
            <span slot="footer" class="dialog-footer">
                <el-button @click="pullDialogVisible = false">{{$t('cancel')}}</el-button>
                <el-button type="primary" @click="pullData">{{$t('confirm')}}</el-button>
            </span>
        </el-dialog>
        <!-- 删除 -->
        <el-dialog :title="$t('hint')" :visible.sync="delDialogVisible" width="420px" class="smallDlog">
            <span>{{$t('confirmdel')}}</span>
            <span slot="footer" class="dialog-footer">
                <el-button @click="delDialogVisible = false">{{$t('cancel')}}</el-button>
                <el-button type="primary" @click="delData">{{$t('confirm')}}</el-button>
            </span>
        </el-dialog>
        <!-- 大袍版型列表 -->
        <el-dialog title="版型列表" :visible.sync="modelDialogVisible" width="1000px" class="styleDlog" @close="robeModelClose">
            <div class="operarea">
                <div class="seach">
                    <el-input v-model="seachModelForm.name" :placeholder="$t('name')" clearable size="mini" @keydown.enter.native="getModelData"></el-input>
                    <el-button size="mini" icon="el-icon-search" @click="getModelData"></el-button>
                </div>
            </div>
            <el-card class="cardBox">
                <el-table style="width: 100%" :data="robeModelTab" stripe v-adaptive="{bottomOffset: 85}" height="100" highlight-current-row @current-change="handleRobeModelChange">
                    <el-table-column prop="name" :label="$t('name')">
                    </el-table-column>
                    <el-table-column prop="bh" :label="$t('serialnumber')">
                    </el-table-column>
                    <el-table-column :label="$t('image')">
                        <template v-slot="scope">
                            <el-image v-if="scope.row.imgUrl !== '' && scope.row.imgUrl !== null" :src="scope.row.imgUrl" class="feelImg" :preview-src-list="getRobeModelSrcList(scope.$index)"></el-image>
                        </template>
                    </el-table-column>
                </el-table>
                <el-pagination
                    small
                    @size-change="handleModelSizeChange"
                    @current-change="handleModelCurrentChange"
                    :pager-count="11"
                    :current-page.sync="seachModelForm.pageNo"
                    :page-sizes="[10, 20, 30, 40]"
                    :page-size="seachModelForm.pageSize"
                    layout="sizes, prev, pager, next"
                    :total="robeParrTotal">
                </el-pagination>
                </el-card>
            <span slot="footer" class="dialog-footer">
                <el-button type="primary" @click="modelDialogVisible = false">已选择</el-button>
            </span>
        </el-dialog>
        <!-- 大袍风格列表 -->
        <el-dialog title="风格列表" :visible.sync="robeStylusDialogVisible" width="1000px" class="styleDlog" @close="robeStyleClose">
            <div class="operarea">
                <div class="seach">
                    <el-input v-model="seachRobeStyleForm.name" :placeholder="$t('name')" clearable size="mini" @keydown.enter.native="seachRobeStyleData"></el-input>
                    <el-input v-model="seachRobeStyleForm.description" :placeholder="$t('description')" clearable size="mini" @keydown.enter.native="seachRobeStyleData"></el-input>
                    <el-button size="mini" icon="el-icon-search" @click="seachRobeStyleData"></el-button>
                </div>
            </div>
            <el-card class="cardBox">
                <el-table style="width: 100%" :data="styleRobeTab" highlight-current-row @current-change="handleRobeStyleChange">
                    <el-table-column prop="name" :label="$t('name')">
                    </el-table-column>
                    <el-table-column prop="description" :label="$t('description')">
                    </el-table-column>
                    <el-table-column :label="$t('image')">
                        <template v-slot="scope">
                            <el-image :src="scope.row.imgUrl" class="feelImg" :preview-src-list="getSrcList(scope.$index)"></el-image>
                        </template>
                    </el-table-column>
                </el-table>
                <el-pagination
                    small
                    @size-change="handleRobeStyleSizeChange"
                    @current-change="handleRobeStyleCurrentChange"
                    :pager-count="11"
                    :current-page.sync="seachRobeStyleForm.pageNo"
                    :page-sizes="[10, 20, 30, 40]"
                    :page-size="seachRobeStyleForm.pageSize"
                    layout="sizes, prev, pager, next"
                    :total="robeStyleTotal">
                </el-pagination>
            </el-card>
            <span slot="footer" class="dialog-footer">
                <el-button type="primary" @click="robeStylusDialogVisible = false">已选择</el-button>
            </span>
        </el-dialog>
        <!-- 大袍绣花 -->
        <el-dialog title="绣花列表" :visible.sync="robeEmbDialogVisible" width="1000px" class="styleDlog" @close="robeEmbClose">
            <div class="operarea">
                <div class="seach">
                    <el-input v-model="seachRobeEmbForm.name" :placeholder="$t('name')" clearable size="mini"></el-input>
                    <el-button size="mini" icon="el-icon-search" @click="getRobeEmbData"></el-button>
                </div>
            </div>
            <el-card class="cardBox">
                <el-table style="width: 100%" :data="robeEmbroTab" row-key="id" @selection-change="handleEmbSelectionChange">
                    <el-table-column type="selection" :reserve-selection="true">
                    </el-table-column>
                    <el-table-column prop="name" :label="$t('name')">
                    </el-table-column>
                    <el-table-column prop="cloType" :label="$t('type')">
                    </el-table-column>
                    <el-table-column prop="patternName" label="版型">
                    </el-table-column>
                    <el-table-column prop="attribute" :label="$t('attribute')">
                    </el-table-column>
                    <el-table-column :label="$t('image')">
                        <template v-slot="scope">
                            <el-image v-if="scope.row.imgUrl !== '' && scope.row.imgUrl !== null" :src="scope.row.imgUrl" class="feelImg" :preview-src-list="getEmbSrcList(scope.$index)"></el-image>
                        </template>
                    </el-table-column>
                </el-table>
                <el-pagination
                    small
                    @size-change="handleRobeEmbSizeChange"
                    @current-change="handleRobeEmbCurrentChange"
                    :pager-count="11"
                    :current-page.sync="seachRobeEmbForm.pageNo"
                    :page-sizes="[10, 20, 30, 40]"
                    :page-size="seachRobeEmbForm.pageSize"
                    layout="sizes, prev, pager, next"
                    :total="robeEmbTotal">
                </el-pagination>
            </el-card>
            <span slot="footer" class="dialog-footer">
                <el-button type="primary" @click="robeEmbDialogVisible = false">已选择</el-button>
            </span>
        </el-dialog>
        <!-- 面料引用 -->
        <el-dialog title="面料选择" class="smallfhDlog" :visible.sync="embliningDialogVisible" width="600px" @close="embliningDialogVisibleClosed" :modal-append-to-body="false">
            <el-form :model="editEmbForm" :ref="editEmbForm" class="motuoForm">
                <el-form-item label="面料" label-width="70px" prop="underlayFabId">
                    <el-cascader v-model="selectEmbId" :options="embForm" key="id" :props="{ label: 'name', value: 'id', children: 'fabrics', multiple: true, disabled: 'isPar' }" clearable></el-cascader>
                </el-form-item>
            </el-form>
            <span slot="footer" class="dialog-footer">
                <el-button @click="embliningDialogVisible = false" v-preventReClick>{{$t('cancel')}}</el-button>
                <el-button type="primary" @click="editemb(editEmbForm)" v-preventReClick>{{$t('confirm')}}</el-button>
            </span>
        </el-dialog>
    </div>
</template>

<script>
import {
    getPmMdlList,
    getRobesElementAll,
    getStyleAll,
    getEmbroideryList,
    getFABByEMB,
    // getEMBElement,
    // updatePmMdlItem,
    updateStatus,
    // getPmMdlDetail
} from '@/libs/reqlist.js'
export default {
    data () {
        return {
            // 搜索条件
            type: null,
            activeName: 0,
            total: 0,
            seachForm: {
                type: 0,
                title: '',
                publish_status: '',
                pageNo: 1,
                pageSize: 10
            },
            // 表格数据
            bigRobeTab: [],
            robeTable: [],
            imgList: [],
            // 选中的表格数据
            selTabData: [],
            // 操作类型 0-add, 1-modify
            doType: 0,
            // 添加
            addModuleDialogVisible: false,
            addModuleRobesDataForm: {
                type: 0,
                patternId: '',	
                title: '',	
                styleId: '',
                styleName: '',
                keywords: '',
                imgUrl: '',
                carouselUrl: '',	
                detailUrl: '',	
                pmMdlRobeBO: {
                    name: '',
                    recommendedSize: '40'
                },
                eleEmbroideries: []
            },
            addModuleRules: {
                category: [
                    { required: true, message: this.$t('cannotbeemp'), trigger: 'blur'}
                ],
                patternId: [
                    { required: true, message: this.$t('cannotbeemp'), trigger: 'blur'}
                ],
                styleName: [
                    { required: true, message: this.$t('cannotbeemp'), trigger: 'blur'}
                ],
                styleNum: [
                    { required: true, message: this.$t('cannotbeemp'), trigger: 'blur'}
                ],
                title: [
                    { required: true, message: this.$t('cannotbeemp'), trigger: 'blur'}
                ],
                price: [
                    { required: true, message: this.$t('cannotbeemp'), trigger: 'blur'}
                ],
                status: [
                    { required: true, message: this.$t('cannotbeemp'), trigger: 'blur'}
                ],
                soldNumber: [
                    { required: true, message: this.$t('cannotbeemp'), trigger: 'blur'}
                ]
            },
            // 版型name
            patternName: '',
            // 轮播图数组
            carouselUrlList: [],
            fileIndexList: [],
            fileDefaultList: [],
            fileCarouselList: [],
            // 导出
            exportDialogVisible: false,
            // 上架相关
            putDialogVisible: false,
            putForm: {
                uuids: [],
                publishStatus: 1
            },
            // 下架相关
            pullDialogVisible: false,
            pullForm: {
                uuids: [],
                publishStatus: 2
            },
            // 删除相关
            delDialogVisible: false,
            delForm: {
                uuids: [],
                deleteStatus: 1
            },
            // 详情及修改
            editDialogTableVisible: false,
            editDataForm: {},
            // 推荐相关
            dialogTableVisible: false,
            recommendTab: [],
            // 大袍版型列表相关
            modelDialogVisible: false,
            seachModelForm: {
                deleteStatus: 0,
                pageNo: 1,
                pageSize: 10,
                name: '',
                bh: '',
                type: 'robePattern',
                cloType: '0'
            },
            robeParrTotal: 0,
            robeModelTab: [],
            robeModelImgList: [],
            // 大袍风格列表
            robeStylusDialogVisible: false,
            seachRobeStyleForm: {
                type: 0,
                name: '',
                description: '',
                pageNo: 1,
                pageSize: 10
            },
            styleRobeTab: [],
            robeStyleTotal: 0,
            // 大袍绣花
            robeEmbDialogVisible: false,
            seachRobeEmbForm: {
                name: '',
                attribute: '',
                patternId: '',
                cloType: '',
                pageNo: 1,
                pageSize: 10
            },
            robeEmbTotal: 0,
            robeEmbroTab: [],
            robeEmbTab: [],
            robeEmbImgList: [],
            // 绣花对应面料
            embliningDialogVisible: false,
            editEmbForm: {
                id: '',	
                fabids: []
            },
            embForm: [],
            selectEmbId: []
        }
    },
    methods: {
        handleTabs(tab) {
            this.seachForm.type = tab.name - 0
            this.activeName = tab.name
            window.sessionStorage.setItem('modulePro', this.activeName)
            switch (this.activeName) {
                case '0':
                    this.$refs.moduleTable.clearSelection()
                    break
                case '1':
                    this.$refs.kaftenTable.clearSelection()
                    break
            }
            this.seachData()
        },
        // 获取表格信息
        getData () {
            this.imgList = []
            getPmMdlList(JSON.stringify(this.seachForm)).then(res => {
                if (res.data.code == 0) {
                    res.data.data.data.forEach(item => {
                        switch (item.newStatus) {
                            case 0:
                                item.newStatus = '不是'
                                break
                            case 1:
                                item.newStatus = '是'
                        }
                        if (item.imgUrl !== '' && item.imgUrl !== null) this.imgList.push(item.imgUrl)
                    })
                    this.bigRobeTab = res.data.data.data
                    this.total = res.data.data.hits
                }
            })
        },
        // 条件查询
        seachData () {
            this.seachForm.pageNo = 1
            this.getData()
        },
        getSrcList(index) {
            return this.imgList.slice(index).concat(this.imgList.slice(0, index))
        },
        handleSizeChange (newSize) {
            this.seachForm.pageSize = newSize
            this.getData()
        },
        handleCurrentChange (newNum) {
            this.seachForm.pageNo = newNum
            this.getData()
        },
        // 导出表格
        exportData () {},
        // 上传文件超出个数触发
        scotland() {
            this.$message.warning('只能选择一个文件')
        },
        // 图片相关处理
        handleIndexImgUrl(res) {
            if (res.code == 0) {
                switch (this.doType) {
                    case 0:
                        this.addModuleRobesDataForm.imgUrl = res.data
                        break
                    case 1:
                        this.editDataForm.imgUrl = res.data
                        break
                }
            }
        },
        handleCarouselImgUrl(res) {
            if (res.code == 0) {
                switch (this.doType) {
                    case 0:
                        this.carouselUrlList.push(res.data)
                        break
                    case 1:
                        this.carouselUrlList.push(res.data)
                        break
                }
            }
        },
        handleDefaultImgUrl(res) {
            if (res.code == 0) {
                switch (this.doType) {
                    case 0:
                        this.addModuleRobesDataForm.detailUrl = res.data
                        break
                    case 1:
                        this.addModuleRobesDataForm.detailUrl = res.data
                        break
                }
            }
        },
        hadleIndexRemove(file) {
            if (file) {
                switch (this.doType) {
                    case 0:
                        this.fileIndexList = []
                        this.addDataForm.imgUrl = ''
                        break
                    case 1:
                        this.fileIndexList = []
                        this.editDataForm.imgUrl = ''
                        break
                }
            }
        },
        hadleDefaultRemove(file) {
            if (file) {
                switch (this.doType) {
                    case 0:
                        this.fileDefaultList = []
                        this.addDataForm.detailUrl = ''
                        break
                    case 1:
                        this.fileDefaultList = []
                        this.editDataForm.detailUrl = ''
                        break
                }
            }
        },
        hadleCarouselRemove(file, fileList) {
            fileList.forEach(item => {
                this.carouselUrlList.push(item.url.slice(5))
            })
        },
        // 添加
        showAddData() {
            switch (this.activeName) {
                case '0':
                    this.doType = 0
                    this.addModuleDialogVisible = true
                    break
            }
        },
        addModuleData () {
            this.addModuleRobesDataForm.pmMdlRobeBO.name = this.addModuleRobesDataForm.title
            if (this.addModuleRobesDataForm.title == '') return this.$message.warning('标题不能为空')
            if (this.addModuleRobesDataForm.styleName == '') return this.$message.warning('风格不能为空')
            if (this.addModuleRobesDataForm.eleEmbroideries == {}) return this.$message.warning('绑定绣花与面料不能为空')
        },
        addModuleDlogClose(form) {
            this.$refs[form].resetFields()
            this.addModuleRobesDataForm.imgUrl = ''
            this.addModuleRobesDataForm.detailUrl = ''
            this.addModuleRobesDataForm.carouselUrl = ''
            this.patternName = ''
        },
        checkPatternName() {
            this.seachModel()
            this.modelDialogVisible = true
        },
        checkStyle() {
            this.getRobeStyleData()
            this.robeStylusDialogVisible = true
        },
        checkEMB() {
            this.getRobeEmbData()
            this.robeEmbDialogVisible = true
        },
        // 表格选中处理
        handleSelectionChange (select) {
            this.selTabData = select
        },
        // 上架
        showPutData () {
            if (this.selTabData.length === 0) {
                this.$message.error(this.$t('plsselthepro'))
                return
            }
            let isTure = this.selTabData.some(item => {
                this.putForm.uuids.push(item.uuid)
                return item.publishDesc == '已上架'
            })
            if (isTure) {
                this.putForm.uuids = []
                this.putDialogVisible = false
                return this.$message.error('包含已上架款式，请重新选择')
            }
            this.putDialogVisible = true
        },
        putData () {
            updateStatus(JSON.stringify(this.putForm)).then(res => {
                if (res.data.code == 0) {
                    this.$message.success('上架成功')
                    this.putDialogVisible = false
                    this.getData()
                    switch (this.activeName) {
                        case '0':
                            this.$refs.moduleTable.clearSelection()
                            break
                        case '1':
                            this.$refs.kaftenTable.clearSelection()
                            break
                    }
                }
            })
        },
        putClose() {
            this.putForm.uuids = []
        },
        // 下架
        showPullData () {
            if (this.selTabData.length === 0) {
                this.$message.error(this.$t('plsselthepro'))
                return
            }
            let isTure = this.selTabData.some(item => {
                this.pullForm.uuids.push(item.uuid)
                return item.publishDesc == '已下架'
            })
            if (isTure) {
                this.pullForm.uuids = []
                this.pullDialogVisible = false
                return this.$message.error('包含已下架商品，请重新选择')
            }
            this.pullDialogVisible = true
        },
        pullData () {
            updateStatus(JSON.stringify(this.pullForm)).then(res => {
                if (res.data.code == 0) {
                    this.$message.success('下架成功')
                    this.pullDialogVisible = false
                    this.getData()
                    switch (this.activeName) {
                        case '0':
                            this.$refs.moduleTable.clearSelection()
                            break
                        case '1':
                            this.$refs.kaftenTable.clearSelection()
                            break
                    }
                }
            })
        },
        pullClose() {
            this.pullForm.uuids = []
        },
        // 删除
        showDelData () {
            if (this.selTabData.length === 0) {
                this.$message.error(this.$t('plsselthepro'))
                return
            }
            this.selTabData.forEach(item => {
                this.delForm.uuids.push(item.uuid)
            })
            this.delDialogVisible = true
        },
        delData () {
            updateStatus(JSON.stringify(this.delForm)).then(res => {
                if (res.data.code == 0) {
                    this.$message.success('删除成功')
                    this.delDialogVisible = false
                    this.getData()
                    switch (this.activeName) {
                        case '0':
                            this.$refs.moduleTable.clearSelection()
                            break
                        case '1':
                            this.$refs.kaftenTable.clearSelection()
                            break
                    }
                }
            })
        },
        // 获取推荐数据
        getRecommend () {
            this.dialogTableVisible = true
        },
        // 获取详情
        getDetails (id) {
            console.log(id)
            this.editDialogTableVisible = true
        },
        editData (form) {
            console.log(form)
            this.$message({ type: 'success', message: 'Life is good' })
            this.editDialogTableVisible = false
        },
        // 大袍版型操作
        seachModel() {
            this.robeModelImgList = []
            getRobesElementAll(this.seachModelForm).then(res => {
                if (res.data.code === 0) {
                    res.data.data.data.forEach(item => {
                        if (item.imgUrl !== '' && item.imgUrl !== null) this.robeModelImgList.push(item.imgUrl)
                    })
                    this.robeModelTab = res.data.data.data
                    this.robeParrTotal = res.data.data.totalPage
                }
            })
        },
        getRobeModelSrcList(index) {
            return this.robeModelImgList.slice(index).concat(this.robeModelImgList.slice(0, index))
        },
        getModelData() {
            this.seachModelForm.pageNo = 1
            this.seachModel()
        },
        handleModelSizeChange(newSize) {
            this.seachModelForm.pageSize = newSize
            this.seachModel()
        },
        handleModelCurrentChange(newNum) {
            this.seachModelForm.pageNo = newNum
            this.seachModel()
        },
        handleRobeModelChange(row) {
            if (!row) return
            switch (this.doType) {
                case 0:
                    this.addModuleRobesDataForm.patternId = row.uuid
                    this.patternName = row.name
                    break
                case 1:
                    this.modifyDataForm.patternId = row.uuid
                    this.modelName = row.name
                    break
            }
        },
        robeModelClose() {
            this.seachModelForm.name = ''
            this.seachModelForm.pageNo = 1
            this.seachModelForm.pageSize = 10
        },
        // 大袍风格
        seachRobeStyleData() {
            this.seachRobeStyleForm.pageNo = 1
            this.getRobeStyleData()
        },
        getRobeStyleData() {
            getStyleAll(this.seachRobeStyleForm).then(res => {
                if (res.data.code == 0) {
                    this.styleRobeTab = res.data.data.data
                    this.robeStyleTotal = res.data.data.hits
                }
            })
        },
        handleRobeStyleSizeChange(newSize) {
            this.seachRobeStyleForm.pageSize = newSize
            this.getRobeStyleData()
        },
        handleRobeStyleCurrentChange(newNum) {
            this.seachRobeStyleForm.pageNo = newNum
            this.getRobeStyleData()
        },
        handleRobeStyleChange(row) {
            if (!row) return
            switch (this.doType) {
                case 0:
                    this.addModuleRobesDataForm.styleId = row.uuid
                    this.addModuleRobesDataForm.styleName = row.name
                    break
                case 1:
                    this.modifyDataForm.patternId = row.uuid
                    this.modelName = row.name
                    break
            }
        },
        robeStyleClose() {
            this.seachRobeStyleForm.name = ''
            this.seachRobeStyleForm.description = ''
            this.seachRobeStyleForm.pageNo = 1
            this.seachRobeStyleForm.pageSize = 10
        },
        // 绣花面料相关
        seachRobeEmbData() {
            this.seachRobeStyleForm.pageNo = 1
            this.getRobeEmbData()
        },
        getRobeEmbData() {
            this.imgList = []
            getEmbroideryList(this.seachRobeEmbForm).then(res => {
                if (res.data.code == 0) {
                    this.robeEmbTotal = res.data.data.totalPage
                    res.data.data.data.forEach(item => {
                        if (item.imgUrl !== '' && item.imgUrl !== null) this.robeEmbImgList.push(item.imgUrl)
                        switch (item.cloType) {
                            case '0':
                                item.cloType = '大袍'
                                break
                            case '1':
                                item.cloType = 'kaften'
                                break
                        }
                    })
                    this.robeEmbroTab = res.data.data.data
                }
            })
        },
        getEmbSrcList(index) {
            return this.robeEmbImgList.slice(index).concat(this.robeEmbImgList.slice(0, index))
        },
        handleRobeEmbSizeChange(newSize) {
            this.seachRobeStyleForm.pageSize = newSize
            this.getRobeEmbData()
        },
        handleRobeEmbCurrentChange(newNum) {
            this.seachRobeStyleForm.pageNo = newNum
            this.getRobeEmbData()
        },
        handleRobeEmbChange(row) {
            if (!row) return
            switch (this.doType) {
                case 0:
                    this.addModuleRobesDataForm.styleId = row.uuid
                    this.addModuleRobesDataForm.styleName = row.name
                    break
                case 1:
                    this.modifyDataForm.patternId = row.uuid
                    this.modelName = row.name
                    break
            }
        },
        robeEmbClose() {
            this.seachRobeStyleForm.name = ''
            this.seachRobeStyleForm.description = ''
            this.seachRobeStyleForm.pageNo = 1
            this.seachRobeStyleForm.pageSize = 10
        },
        handleEmbSelectionChange(select) {
            this.robeEmbTab = select
        },
        setItemEmb(id) {
            this.getCurrentFabEmb(id)
        },
        // 绣花面料相关
        getCurrentFabEmb(id) {
            getFABByEMB(JSON.stringify({ id: id })).then(res => {
                switch (res.data.code) {
                    case 0:
                        res.data.data.forEach(item => {
                            if (item.fabrics == null) item.isPar = true
                            if (item.fabrics !== null) item.isPar = false
                            switch (item.isPar) {
                                case true:
                                    break
                                case false:
                                    item.fabrics.forEach(one => {
                                        switch (one.hasBinding) {
                                            case 0:
                                                break
                                            case 1:
                                                this.selectEmbId.push([item.id, one.id])
                                                break
                                        }
                                    })
                                    break
                            }
                        })
                        this.embForm = res.data.data
                        this.editEmbForm.id = id
                        this.embliningDialogVisible = true
                        break
                    case 1:
                        this.embliningDialogVisible = false
                        break
                }
            })
        },
        embliningDialogVisibleClosed() {},
        editemb() {
            switch (this.selectEmbId.length) {
                case 0:
                    this.editEmbForm.fabids = []
                    break
                default:
                    this.selectEmbId.forEach(item => {
                        this.editEmbForm.fabids.push(item[1])
                    })
                    break
            }
            this.addModuleRobesDataForm.eleEmbroideries.push(this.selectEmbId)
            console.log(this.addModuleRobesDataForm)
        }
    },
    mounted() {
        this.getData()
    }
}
</script>

<style lang="less" scoped>
@import './modulepro.less';
</style>
